<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>后台管理</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
  <script type="text/javascript" src="./plugin/jqueryqrcode/src/jquery.min.js"></script>
  <script type="text/javascript" src="./plugin/jqueryqrcode/src/jquery.qrcode.js"></script>
  <script type="text/javascript" src="./plugin/jqueryqrcode/src/qrcode.js"></script>
  </head>
  <style>
  
   body {
 		margin: 0px 0px;
		padding: 0px 0px;
   		width: 100%;
   		height: 100%;
  }
  
  #frame{
  	background-image: url(/wifiBAM/bamimg/login/login.jpg);
  	background-repeat:no-repeat;
  	background-position:center; 
  	background-size:100% 100%;
  	background-attachment: fixed;
  	min-width: 100%;
  	min-height: 100%;
  	padding-top:10%;
  }
  #qrdiv{
  	position:absolute;
  	height: 420px;
	width:300px;
	right:30%; 
	top:20%; 
  	background-color:#000; opacity:0.6;filter:alpha(opacity=50);
  }
  #textdiv{
  	float:left;
  	margin-left:420px;
  	font-weight:800;
  	color:#ffa500;
  	font-size:30px; 
  }
  #qrcodeCanvas{
  	opacity:2;
  }
  #p{
 	padding-left: 25px;
  	font-size: 14px;
  	color: #708090;
  }
  #head{
  	font-weight:800;
  	color:white;
  	font-size:16px; 
  	padding-top:15px; 
  	padding-left: 25px
  }
  #QRhiu{
  		display:none;
		background-color: #000;
		height: 300px;
  		width:300px;
		right:30%; 
		top:25%; 
 		opacity:0.95; 
 		z-index:1; 
 		 position:fixed!important; 
 		position:absolute;
	}
  #qra{
  	display:none;
  	z-index:99; 
  	position:fixed!important; 
 	position:absolute;
 	right:36%; 
	top:35%; 
	color:white;
	font-weight:800;
  	margin-left: 50px;
  	margin-top: 100px;
  }
  
  </style>
   <body >
   <div id="frame">
   		<div id="textdiv"><p>后台数据管理系统</p>
   		<p style="font-size:25px; ">  &nbsp;Altair  Network</p>
   		
   		</div>
	 	<div id="qrdiv">
	 	
	    	<p id="head">牛 郎  wi-fi</p>
	   		<div style="border: solid 21px white ;width: 257;">
	        <div id="qrcodeCanvas">
	        </div>
	        </div>
	       
	        <p id="p">请使用APP扫描登录
	         <div id="QRhiu"></div>
	    </div>
	    <a id="qra" href="${pageContext.request.contextPath}/bamjsp/login/login.jsp">点击刷新</a>
	    <div style="clear: none;"></div>
    </div>
    <form action="${pageContext.request.contextPath}/access/login_verifyLogin.action" method="post">
    	<input id="userid" name="userid" type="hidden"/>
   		<input id="token" name="token" type="hidden"/>
    </form>
   
</body>
<script>
	 $(document).ready(function() {
        var uuid;
         $.ajax({
		   type: "get",
		   url: "${pageContext.request.contextPath}/access/login_QRCreate.action",
		   data: {},
		   dataType:"json",
		   success: function(msg){
			    var obj = eval("("+msg+")");
			     //存储UUID
	            uuid = obj.uuid;
	            var text = obj.text;
	             var jsonStr = JSON.stringify( text );
	            //显示二维码
	            jQuery('#qrcodeCanvas').qrcode({
					text	: jsonStr
				});
	           	init();
	        	validateLogin();
		    },
	     	error:function(){
	   		alert("系统出错误,请联系技术人员");
		   }
		  });
		   var j=0;
		   function validateLogin(){
     		var timestamp1=new Date().getTime();//每次请求前时间
           $.ajax({
		   type: "get",
		   url: "${pageContext.request.contextPath}/access/login_QRAlive.action?sessionid="+uuid,
		   data: {},
		   dataType:"json",
		   success: function(msg){
		   		var timestamp2=new Date().getTime();//每次请求成功后时间
		   		var timestamp = timestamp2-timestamp1;
                if(msg == ""){
                	j=j+timestamp;
                	if(j<300000){//5分钟后不再请求后台
                    	validateLogin();
                    }
                }else{
                 	var obj = eval("("+msg+")");
                	var userid = obj.userid;
                	var token = obj.token;
                	$("#userid").val(userid);
                	$("#token").val(token);
                	$("form:first").submit();
                }
            }});
         }  
		  
    });
   
    	   
     
    
    
    
    
    
    function init(){
		var t;
		shownum();
	}
	var i =300; 
	
function shownum(){ 
	i=i-1; 
	if(i>-1){
		t = setTimeout('shownum()',1000); 
	}else{
		document.getElementById("QRhiu").style.display="block";
		document.getElementById("qra").style.display="block";
		clearTimeout(t);
		}
	}
</script>

</html>
